<template>
  <div>
    <el-table :data="state.tableData" border style="width: 100%">
      <el-table-column prop="wxUserId" label="用户id" />
      <el-table-column prop="feedBackContent" label="反馈意见" />
      <el-table-column label="反馈时间">
        <template #default="scope">
          {{ formatDate(new Date(scope.row.createdDate), 'YYYY-mm-dd') }}
        </template>
      </el-table-column>
    </el-table>
    <Pagination :total="state.total" :limit="state.pageSize" :page-change="PageChange" />
  </div>
</template>

<script lang="ts" setup>
import { reactive } from 'vue';
import Pagination from '@/components/pagination/index.vue'
import { postFeedList } from "@/api/base"
import { formatDate } from '@/utils/formatTime'

const state = reactive({
  tableData: [],
  total: 0,
  pageNum: 1,
  pageSize: 10
})

const getTableData = () => {
  postFeedList({
    pageNum: state.pageNum,
    pageSize: state.pageSize,
  }).then(res => {
    state.tableData = res.data.rows || []
    state.total = res.data.total || 0
  })
}
getTableData()
// 分页
const PageChange = (page: number) => {
  state.pageNum = page;
  getTableData()
}
</script>

<style lang="scss" scoped>
.el-form .el-form-item:last-of-type {
  margin-bottom: 18px !important;
}
</style>
